<template>
  <div class="child">
    <h2>子组件2</h2>
    <h4>怪兽: {{ montser }}</h4>
    <h4 v-if="toy">哥哥的玩具: {{ toy }}</h4>
  </div>
</template>

<script setup lang="ts">
  import {ref, onUnmounted} from 'vue'
  import emitter from '@/utils/emitter';
  let montser = ref('怪兽')
  let toy = ref('')

  // 给emitter绑定事件
  emitter.on('getToy', (val:any)=>{
    toy.value = val
    console.log('getToy触发了')
  })

  // 在组件卸载时 解绑
  onUnmounted(()=>{
    emitter.off('getToy')
  })

</script>

<style>
  .child {
    background: blue;
  }
</style>